<template>
	<div class="easyd-weixin-Box">

		<div class="app_page">
			<div class="after_sale_list app_box_content_list app_list_box" v-for="item in orderData">
				
				<div class="app_box_flex">
					<div class="app_box_content_left C4">
						{{$common.getTimes(item.apo_create_time,'shifen')}}
					</div>
					<div class="app_box_content_right" style="color: red;">
						待服务
					</div>
				</div>
				<div class="after_sale_content">
					<div class="txt_img">
						<img :src="item.apo_product_image" />
						<span style="color: #0fd004;" v-if="item.apo_type == 1">新购订单</span>
						<span style="color: #0fd004;" v-if="item.apo_type == 2">正常购买</span>
						<span style="color: #0fd004;" v-if="item.apo_type == 3">续费订单</span>
					</div>
					<div class="after_sale_info order_info_list C4">
						<div class="app_box_flex">
							<div class="text_left">
								订单号：{{item.apo_no}}
							</div>
							<div class="text_right app_box_flex_1" style="color: #FBD415;">
								¥{{item.apo_real_pay}}
							</div>
						</div>
						<div class="app_box_flex">
							<div class="text_left">
								姓名：{{item.apo_contact}}
							</div>
							<div class="text_right app_box_flex_1">
								×{{item.apo_school_count}}
							</div>
						</div>
						<div class="app_box_flex">
							<div class="text_left">
								电话：{{item.apo_phone}}
							</div>
							<div class="text_right app_box_flex_1" @click="orderProcessing(item.apo_id)">
								<div class="app_float_right">
									点击处理
								</div>
							</div>
						</div>
						<div class="app_box_flex">
							<div class="text_left">
								校区：{{item.campusName}}
							</div>
						</div>
					</div>
				</div>
				<!--<div class="after_sale_time C4 T3">
					<span class="app_float_left">开户订单</span>
				</div>-->
			</div>
		</div>

	</div>
</template>

<script>
	import { mapState, mapMutations } from "vuex";
	export default {

		data() {
			return {

			};
		},
		computed: {
			...mapState({
				orderData : state => state.AfterSaleModule.orderData,
                tempSellAll: state => state.HomeModule.tempSellAll,
			})
		},
		mounted() {
			this.initData();
		},
		methods: {

			//  ...mapMutations(["ShopIndexModule/updateIsShopGuide"]),
			initData() {
				
                //是否是超管
//              var isRoot = "/is_manager/0";
//              if(this.$userData.getUID()==1){
//              	isRoot = "/is_manager/1";
//              }
                    
            	var isRoot = '';   
                if (this.tempSellAll.u_master_osid != undefined && this.tempSellAll.u_master_osid != null && this.tempSellAll.u_master_osid != '') {
                	isRoot = ''
                    + "/u_id/" + this.tempSellAll.u_id
                    + "/u_osid/" + this.tempSellAll.u_master_osid
                    + "/is_manager/" + this.tempSellAll.u_is_manager 
                    + "/u_type/" + this.tempSellAll.u_type 
                    + "/u_leader/" + this.tempSellAll.u_leader;
            	}else{
            		isRoot = ''
                    + "/u_id/" + this.$userData.getUID()
                    + "/u_osid/" + this.$userData.getOsid()
                    + "/is_manager/" + this.$userData.getIsManager() 
                    + "/u_type/" + this.$userData.getOsType() 
                    + "/u_leader/" + this.$userData.getLeader();
            	}
                
				this.$easyUtil.startLoading(this);
				this.$http.getHttp(
						this.$API.apiWaitingForServiceList + isRoot,
						rs => {
							this.$easyUtil.endLoading(this);
							console.log(rs);
							this.$store.commit("AfterSaleModule/updateOrderData", rs.waitingForServiceList);
							this.getNodeData(0, 0);
						}
				);
			},
			orderProcessing(id){
				this.$easyUtil.GO(this, '/orderDetail',{order_id:id})
			},

			uploadChange(e) {
				console.log("上传");
			},
		}
	};
</script>

<style lang="stylus" scoped>
	@import '~PUBLIC_CSS';
	
	.after_sale_list {
		overflow: hidden;
	}
	
	.after_sale_list .after_sale_info {
		float: initial;
	}
	
	.after_sale_list .after_sale_time {
		overflow: hidden;
		width: 100%;
	}
	
	.after_sale_list .app_float_right {
		border: 1px solid #fbd415;
		padding: 0 10px 2px;
		line-height: initial;
		border-radius: 4px;
	}
	
	.after_sale_content {
		overflow: hidden;
		display: flex;
	}
	.after_sale_content .txt_img {
		text-align: center;
		padding-right: 10px;
	}
	.after_sale_content .txt_img img {
		display: block;
		height: 70px;
		width: 70px;
		flex:initial;
		object-fit: cover;
	}
	.after_sale_content .order_info_list {
		flex: 1;
	}
	.after_sale_content .order_info_list .app_box_flex{
		line-height: 24px;
	}
	
	.app_box_flex .text_left{
		text-align: left;
	}
	.app_box_flex .text_right{
		text-align: right;
	}
</style>